<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>循环语句的使用(The use of loop statements)</title>
    <!-- 
  在JavaScript中，循环语句用于重复执行一段代码，直到满足某个条件为止。
  循环语句的主要类型包括： `for` 循环、 `while` 循环和 `do...while` 循环。
  1.  `for`  循环
    `for` 循环用于在已知迭代次数的情况下执行一段代码。
    for (初始化; 条件; 增量) {
        // 循环体
    }

  2.  `while`  循环
    `while` 循环在条件为真时重复执行代码块，适用于在不知道迭代次数的情况下使用。
    while (条件) {
        // 循环体
    }
  
  3.  `do...while`  循环
    `do...while` 循环与 `while` 循环类似，但它会先执行一次循环体，然后再判断条件。这意味着即使条件为假，循环体至少会执行一次。
    do {
        // 循环体
    } while (条件);

  4.  `for...of`  循环
    `for...of` 循环用于遍历可迭代对象（如数组、字符串、Map、Set等）。
    for (const item of iterable) {
        // 循环体
    }

  5.  `for...in`  循环
    `for...in` 循环用于遍历对象的可枚举属性。
    for (const key in object) {
        // 循环体
    }

  总结
  -  `for` 循环：适合已知循环次数的情况。
  -  `while` 循环：适合在条件不确定的情况下使用。
  -  `do...while` 循环：至少执行一次循环体。
  -  `for...of` 循环：用于遍历可迭代对象。
  -  `for...in` 循环：用于遍历对象的属性。
     -->
  </head>
  <body>
    <script>
      // 1. for 循环
      for (let i = 0; i < 5; i++) {
        console.log("for 循环:", i); // 输出 0, 1, 2, 3, 4
      }

      // 2. while 循环
      let j = 0;
      while (j < 5) {
        console.log("while 循环:", j); // 输出 0, 1, 2, 3, 4
        j++;
      }

      // 3. do...while 循环
      let k = 0;
      do {
        console.log("do...while 循环:", k); // 输出 0, 1, 2, 3, 4
        k++;
      } while (k < 5);

      // 4. for...of 循环
      const arr = [1, 2, 3, 4, 5];
      for (const item of arr) {
        console.log("for...of 循环:", item); // 输出 1, 2, 3, 4, 5
      }

      // 5. for...in 循环
      const obj = { a: 1, b: 2, c: 3 };
      for (const key in obj) {
        console.log("for...in 循环:", key, obj[key]); // 输出 "a 1", "b 2", "c 3"
      }
    </script>
  </body>
</html>
